<template>
  <div class="cart-container">

    <div class="left-cart">
      <van-sidebar v-model="activeKey">
        <van-sidebar-item :title="item.name" v-for="(item,i) in cartclum" :key="item.parentId" @click="getsublist(i)" />
      </van-sidebar>
    </div>
    <div class="cart-right">
      <ul class="sub-name clearfix">
        <li v-for="item in sublist" :key="item.id">
          <a href="">
            {{ item.name }}
          </a>
        </li>
      </ul>
      <ul class="cartlist-container">
        <li  @click="goArticle(item.id)" v-for="item in cartlist" :key="item.id">
          <div class="img-box">
            <img :src="item.albums[0]" alt="" srcset="">
          </div>
          <p>{{ item.title }}</p>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
  import {
    Toast
  } from "vant";
  export default {
    data() {
      return {
        activeKey: 0,
        cartclum: [],
        sublist: [],
        cartlist: [],
        page: 10,
      };
    },
    created() {
      this.Getcartclum();
      this.Getcartlist();
    },
    methods: {
      Getcartclum() {
        this.$http
          .get("json/cart/cart-clum.json").then(result => {
            if (result.body.resultcode == 200) {
              this.cartclum = result.body.result;
              this.sublist = this.cartclum[0].list.slice(0, 15);
            } else {
              Toast("数据加载失败");
            }
          });
      },
      // 切换二级栏目
      getsublist(id) {
        this.sublist = this.cartclum[id].list.slice(0, 15);
        this.cartlist.sort(function(){return Math.random()>0.5?-1:1;}); 
      },
      Getcartlist() {
        this.$http.get("json/cart/cart-list.json").then(result => {
          if (result.body.resultcode == 200) {
            this.cartlist = result.body.result.data;
          } else {
            Toast("数据加载失败");
          }
        });
        this.$http.get("json/cart/cart-list2.json").then(result => {
          if (result.body.resultcode == 200) {
            this.cartlist = this.cartlist.concat(result.body.result.data)
          } else {
            Toast("数据加载失败");
          }
        });
        this.$http.get("json/cart/cart-list3.json").then(result => {
          if (result.body.resultcode == 200) {
            this.cartlist = this.cartlist.concat(result.body.result.data)
          } else {
            Toast("数据加载失败");
          }
        });
      },
      goArticle(id){
        this.$router.push('/cart/article/'+id)
      }
    }
  };

</script>

<style lang="scss">
</style>
